@import "variable.less"; // Variable.less
[contenteditable] {
  &:hover,
  &:focus {
    background: lighten(@primary, 15%);
  }
}

.control-bar {
  position: relative;
  z-index: 100;
  background: @primary;
  color: @white;
  padding: 15px;
  margin-bottom: 30px;
  .slogan {
    font-weight: bold;
    font-size: 1.2rem;
    display: inline-block;
    margin-right: 2rem;
  }
  label {
    margin: 0px;
    color: @white;
  }
  a {
    margin: 0;
    padding: .5em 1em;
    background: @white;
    color: @text;
    &:hover {
      background: lighten(@primary, 15%);
    }
  }
  input {
    border: none;
    background: lighten(@primary, 15%);
    max-width: 30px;
    text-align: center;
    color: @text;
    &:hover {
      background: lighten(@primary, 15%);
    }
  }
}

.hidetax {
  .taxrelated {
    display: none;
  }
}

.showtax {
  .notaxrelated {
    display: none;
  }
}

.hidedate {
  .daterelated {
    display: none;
  }
}

.showdate {
  .notdaterelated {
    display: none;
  }
}

.details {
  input {
    display: inline;
    margin: 0 0 0 .5rem;
    border: none;
    width: 55px;
    min-width: 0;
    background: transparent;
    text-align: left;
  }
}

// CURRENCY Symbol

.invoice-edit {
  .rate,
  .price,
  .sum,
  .tax,
  #total_price,
  #total_tax {
    &:before {
      content: '€';
    }
  }
  .me,
  .info,
  .bank,
  .smallme,
  .client,
  .bill,
  .details {
    padding: 15px;
  }

}

.invoice-logo img {
  display: block;
  vertical-align: top;
  width: 50px;
}

/**
 * INVOICELIST BODY
 */

.invoicelist-body {
  margin: 1rem;
  table {
    width: 100%;
  }
  thead {
    text-align: left;
    border-bottom: 2pt solid #666;
  }
  td,
  th {
    position: relative;
    padding: 1rem;
  }
  tr:nth-child(even) {
    background: @white-light;
  }
  tr {
    &:hover {
      .removeRow {
        display: block;
      }
    }
  }
  input {
    display: inline;
    margin: 0;
    border: none;
    width: 80%;
    min-width: 0;
    background: transparent;
    text-align: left;
  }
  .control {
    display: inline-block;
    color: white;
    background: @primary;
    padding: 3px 7px;
    font-size: .9rem;
    text-transform: uppercase;
    cursor: pointer;
    &:hover {
      background: lighten(@primary, 5%);
    }
  }
  .newRow {
    margin: .5rem 0;
    float: left;
  }
  .removeRow {
    display: none;
    position: absolute;
    top: .1rem;
    bottom: .1rem;
    left: -1.3rem;
    font-size: .7rem;
    border-radius: 3px 0 0 3px;
    padding: .5rem;
  }
}

/**
 * INVOICE LIST FOOTER
 */

.invoicelist-footer {
  margin: 1rem;
  table {
    float: right;
    width: 25%;
    td {
      padding: 1rem 2rem 0 1rem;
      text-align: right;
    }
    tr:nth-child(2) {
      td {
        padding-top: 0;
      }
    }
    #total_price {
      font-size: 2rem;
      color: @primary;
    }
  }
}

/**
 * NOTE
 */

.note {
  margin: 75px 15px;
  .hidenote & {
    display: none;
  }
  h2 {
    margin: 0;
    font-size: 12px;
    font-weight: bold;
  }
  p {
    font-size: 12px;
    padding: 0px 5px;
  }
}

/**
 * FOOTER
 */

footer {
  display: block;
  margin: 1rem 0;
  padding: 1rem 0 0;
  p {
    font-size: 12px;
  }
}

/**
 * PRINT STYLE
 */

@media print {
  .header,
  .sidebar,
  .chat-sidebar,
  .control,
  .control-bar {
    display: none !important;
  }

  [contenteditable] {
    &:hover,
    &:focus {
      outline: none;
    }
  }
}